<template>
  <div class="picker" @click.self="add">
    <div class="con">
        <h3>大小</h3>
        <span>47</span>
        <span>36</span>
        <span>37</span>
        <h3>分期</h3>
        <span>3个月</span>
        <span>6个月</span>
        <span>12个月</span>
        <br>
        <button @click="add">加入购物车</button>
    </div>
  </div>
</template>

<script>
export default {
    methods:{
        add(){
            this.$emit("hide")
        }
    }
}
</script>

<style scoped>
    .picker{
        width: 100vw;
        height: 100vh;
        background: rgba(0,0,0,0.3);
        position: absolute;
        left:0px;
        top:0px;
    }
    .con{
        width: 100vw;
        min-height: 200px;
        position: fixed;
        left:0px;
        bottom: 0;
        background: #fff;
    }
    .con span{
        padding: 10px;
        margin: 10px;
        border:1px solid #ccc;
        display: inline-block;
    }
    .con button{
        padding: 10px;
        margin-bottom: 40px;
        margin-right: 0;
    }
</style>